<template>
  <div>
    <el-carousel trigger="click" height="calc(100vh - 59px)">
    <el-carousel-item
      v-for="(item, index) in list"
      :key="index"
      :style="{ backgroundImage: `url(${(item)})` }"
    >
    </el-carousel-item>
  </el-carousel>
  <div class="center">互联网+时代</div>
  </div>
</template>
<script setup>
import { ref } from 'vue'
import img1 from '@/assets/img1.jpg'
import img2 from '@/assets/img2.jpg'
import img3 from '@/assets/img3.jpeg'
const list = ref([img1, img2, img3])
</script>
<style lang="scss" scoped>
.el-carousel > div {
  width: 100%;
  height: 100%;
  background-size: cover;
}
.center{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: 100px;
  line-height: 100px;
  color: #fff;
}
</style>
